<template>
    <div>

      <el-card>

        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="108px">
          <el-form-item label="商品编码" prop="productCore">
            <el-input
              v-model="queryParams.productCore"
              placeholder="请输入商品编码"
              clearable
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="商品名称" prop="productName">
            <el-input
              v-model="queryParams.productName"
              placeholder="请输入商品名称"
              clearable
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>


          <el-form-item label="上下架状态" prop="publishStatus">
            <el-select v-model="queryParams.publishStatus" placeholder="请选择上下架状态：1下架0上架" clearable size="small">
              <el-option label="下架" value="1" />
              <el-option label="上架" value="0" />
            </el-select>
          </el-form-item>




          <el-form-item>
            <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
          </el-form-item>
        </el-form>

        <el-row :gutter="10" class="mb8">

          <el-col :span="1.5">
            <el-button
              type="primary"
              icon="el-icon-plus"
              size="mini"
              @click="handleAdd"
              v-hasPermi="['group:booking:add']"
            >新增</el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="success"
              icon="el-icon-edit"
              size="mini"
              :disabled="single"
              @click="handleUpdate"
              v-hasPermi="['group:booking:edit']"
            >修改</el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="danger"
              icon="el-icon-delete"
              size="mini"
              :disabled="multiple"
              @click="handleDelete"
              v-hasPermi="['group:booking:remove']"
            >删除</el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="warning"
              icon="el-icon-download"
              size="mini"
              @click="handleExport"
              v-hasPermi="['group:booking:export']"
            >导出</el-button>
          </el-col>
          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>

        <el-table v-loading="loading" :data="infoList" @row-dblclick="dbClick" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55" align="center" />
          <!--<el-table-column label="商品ID" align="center" prop="productId" />-->
          <el-table-column label="商品编码" align="center" prop="productCore" />
          <el-table-column label="商品名称" align="center" prop="productName" />


          <el-table-column label="商品销售价格" align="center" prop="price" />

          <el-table-column label="上下架状态" align="center" prop="publishStatus" >
            <template slot-scope="scope">
              {{scope.row.publishStatus=='1' ? '下架' : '上架'}}
            </template>
          </el-table-column>
          <!--<el-table-column label="审核状态：1未审核，0已审核" align="center" prop="auditStatus" />-->


          <el-table-column label="商品有效期" align="center" prop="shelfLife" />
          <el-table-column label="商品描述" align="center" prop="descript" :show-overflow-tooltip="true" />
          <el-table-column label="商品录入时间" align="center" prop="indate" width="180">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.indate, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="最后修改时间" align="center" prop="modifiedTime" width="180">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.modifiedTime, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>

          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                icon="el-icon-edit"
                @click="handleAddPic(scope.row)"
                v-hasPermi="['shopping:master:picadd']"
              >添加图片</el-button>
              <el-button
                size="mini"
                type="text"
                icon="el-icon-edit"
                @click="handleUpdate(scope.row)"
                v-hasPermi="['group:booking:edit']"
              >修改</el-button>
              <el-button
                size="mini"
                type="text"
                icon="el-icon-delete"
                @click="handleDelete(scope.row)"
                v-hasPermi="['group:booking:remove']"
              >删除</el-button>
            </template>
          </el-table-column>
        </el-table>

        <pagination
          v-show="total>0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="getList"
        />

        <!-- 添加或修改商品信息对话框 -->
        <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
          <el-form ref="form" :model="form" :rules="rules" label-width="120px">

            <el-form-item label="商品名称" prop="productName">
              <el-input v-model="form.productName" placeholder="请输入商品名称" />
            </el-form-item>

            <el-form-item label="店铺" prop="supplierId">
                <el-select v-model="form.supplierId" placeholder="店铺" @change="changesupplierId" >
                    <el-option v-for="item in userIdList" :key="item.supplierId" :label="item.shopsName" :value="item.supplierId">

                    </el-option>
                </el-select>
            </el-form-item>

            <el-form-item label="商品销售价格" prop="price">
              <el-input v-model="form.price" placeholder="请输入商品销售价格" />
            </el-form-item>
<!--            <el-form-item label="商品加权平均成本" prop="averageCost">-->
<!--              <el-input v-model="form.averageCost" placeholder="请输入商品加权平均成本" />-->
<!--            </el-form-item>-->

            <el-form-item label="上下架状态">
              <el-select  v-model="form.publishStatus">
                <el-option label="上架" value="0" />
                <el-option label="下架" value="1" />
              </el-select>

              <!--<el-radio-group v-model="form.publishStatus">-->
                <!--<el-radio label="1">下架</el-radio>-->
                <!--<el-radio label="0">上架</el-radio>-->
              <!--</el-radio-group>-->
            </el-form-item>
            <!--<el-form-item label="审核状态：1未审核，0已审核">-->
              <!--<el-radio-group v-model="form.auditStatus">-->
                <!--<el-radio label="1">未审核</el-radio>-->
                <!--<el-radio label="1">已审核</el-radio>-->
              <!--</el-radio-group>-->
            <!--</el-form-item>-->

            <!--<el-form-item label="生产日期" prop="productionDate">-->
              <!--<el-date-picker clearable size="small" style="width: 200px"-->
                              <!--v-model="form.productionDate"-->
                              <!--type="date"-->
                              <!--value-format="yyyy-MM-dd"-->
                              <!--placeholder="选择生产日期">-->
              <!--</el-date-picker>-->
            <!--</el-form-item>-->
            <el-form-item label="商品有效期" prop="shelfLife">
              <el-input v-model="form.shelfLife" placeholder="请输入商品有效期" />
            </el-form-item>
            <el-form-item label="商品描述" prop="descript">
<!--              <el-input v-model="form.descript" placeholder="请输入商品描述" />-->
              <QuillEditor v-model="form.descript" @getChildrenStatus="getChildrenStatus"></QuillEditor>
            </el-form-item>
            <!--<el-form-item label="商品录入时间" prop="indate">-->
              <!--<el-date-picker clearable size="small" style="width: 200px"-->
                              <!--v-model="form.indate"-->
                              <!--type="date"-->
                              <!--value-format="yyyy-MM-dd"-->
                              <!--placeholder="选择商品录入时间">-->
              <!--</el-date-picker>-->
            <!--</el-form-item>-->
            <!--<el-form-item label="最后修改时间" prop="modifiedTime">-->
              <!--<el-date-picker clearable size="small" style="width: 200px"-->
                              <!--v-model="form.modifiedTime"-->
                              <!--type="date"-->
                              <!--value-format="yyyy-MM-dd"-->
                              <!--placeholder="选择最后修改时间">-->
              <!--</el-date-picker>-->
            <!--</el-form-item>-->


          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitForm">确 定</el-button>
            <el-button @click="cancel">取 消</el-button>
          </div>
        </el-dialog>

      </el-card>

      <el-card>
        <div :style="uuu">


        <el-table v-loading="loading"  @row-dblclick="dbClickPic" :data="pictList" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column label="商品图片ID" align="center" prop="productPicId" />
          <el-table-column label="商品ID" align="center" prop="productId" />
          <el-table-column label="图片描述" align="center" prop="picDesc" :show-overflow-tooltip="true" />
          <el-table-column label="图片URL" align="center" prop="picUrl" />
          <el-table-column label="是否主图：0.非主图1.主图" align="center" prop="isMaster" />
          <el-table-column label="图片排序" align="center" prop="picOrder" />
          <el-table-column label="图片是否有效：0无效 1有效" align="center" prop="picStatus" />
          <el-table-column label="最后修改时间" align="center" prop="modifiedTime" width="180">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.modifiedTime, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                icon="el-icon-edit"
                @click="handleSpecification(scope.row)"
                v-hasPermi="['shopping:label:addlab']"
              >添加规格</el-button>
              <el-button
                size="mini"
                type="text"
                icon="el-icon-edit"
                @click="handleUpdatePic(scope.row)"
                v-hasPermi="['shopping:master:picedit']"
              >修改</el-button>
              <el-button
                size="mini"
                type="text"
                icon="el-icon-delete"
                @click="handleDeletePic(scope.row)"
                v-hasPermi="['shopping:master:removeppi']"
              >删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <!-- 添加或修改商品图片信息对话框 -->
        <el-dialog :title="titlePic" :visible.sync="openPic" width="500px" append-to-body>
          <el-form ref="formPic" :model="formPic" label-width="80px">
            <el-form-item label="图片描述" prop="picDesc">
              <el-input v-model="formPic.picDesc" placeholder="请输入图片描述" />
            </el-form-item>
            <el-form-item label="图片URL" prop="picUrl">

              <el-upload
                class="upload-demo"
                :http-request="upload"
                action="aaa"
                accept=".jpg,.png"
                :limit="1"
                :file-list="fileList"
                :on-remove="handleRemove"
                :before-remove="beforeRemove"
                :on-error="handleError"
                ref="upload">
                <el-button size="small" type="primary">点击上传</el-button>
                <div slot="tip" class="el-upload__tip">仅支持jpg,png格式,以最新上传为准</div>
              </el-upload>

              <!--<el-input v-model="formPic.picUrl" placeholder="请输入图片URL" />-->
            </el-form-item>
            <el-form-item label="是否主图" prop="isMaster">
              <el-input v-model="formPic.isMaster" placeholder="请输入是否主图：0.非主图1.主图" />
            </el-form-item>
            <el-form-item label="图片排序" prop="picOrder">
              <el-input v-model="formPic.picOrder" placeholder="请输入图片排序" />
            </el-form-item>

          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitFormPic">确 定</el-button>
            <el-button @click="cancelPic">取 消</el-button>
          </div>
        </el-dialog>
        </div>
      </el-card>

      <el-card>

        <div :style="nnn">


          <el-table v-loading="loading" :data="labelList" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="标签ID" align="center" prop="labelId" />
            <el-table-column label="商品ID" align="center" prop="productId" />
            <el-table-column label="商品库存" align="center" prop="labelQuantity" />
            <el-table-column label="标签名称" align="center" prop="labelName" />
            <el-table-column label="商品图片表ID" align="center" prop="productPicId" />
            <el-table-column label="标签单位" align="center" prop="labelUnit" />
            <el-table-column label="最后修改时间" align="center" prop="modifiedTime" width="180">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.modifiedTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="单买价格" align="center" prop="labelPrice" />
            <el-table-column label="拼团价格" align="center" prop="groupPrice" />
            <el-table-column label="状态" align="center" prop="labelStatus" >
              <template slot-scope="scope">
                <el-tag
                  :type="scope.row.labelStatus === '0' ? 'success' : 'danger'"
                  disable-transitions>{{scope.row.labelStatus ==='0' ? '上架' : '下架'}}</el-tag>
              </template>
            </el-table-column>
            <el-table-column label="颜色" align="center" prop="labelColorType" />
            <el-table-column label="运费价格" align="center" prop="labelFreight" />
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="handleUpdateGg(scope.row)"
                  v-hasPermi="['shopping:label:editlabaa']"
                >修改</el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="handleDeleteGg(scope.row)"
                  v-hasPermi="['shopping:label:labelremove']"
                >删除</el-button>
              </template>
            </el-table-column>
          </el-table>


          <el-dialog :title="titleGg" :visible.sync="openGg" width="450px" append-to-body :before-close="handleClose">
            <el-form ref="formGg" :model="formGg"  label-width="130px">
              <!--<el-form-item label="商品ID" prop="productId">-->
              <!--<el-input v-model="form.productId" placeholder="请输入商品ID" />-->
              <!--</el-form-item>-->
              <el-form-item label="标签名称" prop="labelName">
                <el-input v-model="formGg.labelName" placeholder="请输入标签名称" />
              </el-form-item>
              <!--<el-form-item label="商品图片表ID" prop="productPicId">-->
              <!--<el-input v-model="formGg.productPicId" placeholder="请输入商品图片表ID" />-->
              <!--</el-form-item>-->
              <el-form-item label="标签单位" prop="labelUnit">
                <el-input v-model="formGg.labelUnit" placeholder="请输入标签单位" />
              </el-form-item>

              <el-form-item label="商品库存量" prop="labelQuantity">
                <el-input v-model="formGg.labelQuantity" placeholder="请输入标签单位" />
              </el-form-item>
              <!--<el-form-item label="最后修改时间" prop="modifiedTime">-->
              <!--<el-date-picker clearable size="small" style="width: 200px"-->
              <!--v-model="form.modifiedTime"-->
              <!--type="date"-->
              <!--value-format="yyyy-MM-dd"-->
              <!--placeholder="选择最后修改时间">-->
              <!--</el-date-picker>-->
              <!--</el-form-item>-->
              <el-form-item label="单买价格" prop="labelPrice">
                <el-input v-model="formGg.labelPrice" placeholder="请输入价格" />
              </el-form-item>

              <el-form-item label="拼团价格" prop="groupPrice">
                <el-input v-model="formGg.groupPrice" placeholder="请输入价格" />
              </el-form-item>


              <el-form-item label="状态">
                <el-select  v-model="formGg.labelStatus">
                  <el-option label="上架" value="0" />
                  <el-option label="下架" value="1" />
                </el-select>
              </el-form-item>
              <el-form-item label="颜色详细" prop="labelColorType">
                <el-input v-model="formGg.labelColorType" placeholder="请输入颜色" />
              </el-form-item>

              <el-form-item label="运费" prop="labelColorType">
                <el-input v-model="formGg.labelFreight" placeholder="请输入运费" />
              </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
              <el-button type="primary" @click="submitFormGg">确 定</el-button>
              <el-button @click="cancelGg">取 消</el-button>
            </div>
          </el-dialog>

        </div>

      </el-card>

    </div>
</template>

<script>
  import { listInfo, getInfo, delInfo, addInfo, updateInfo, exportInfo,findAllUserId } from "@/api/super/group";
  import { listInfopi, getInfopi, delInfopi, addInfopi, updateInfopi, exportInfopi, publishStatusUpdate, auditStatusUpdate, listlabelfindall, getInfolab, removelab, addLabel, updateLabel, listppict,getInfoPic,addInfoPic,updateInfoPic,delInfoPic,listlabelfindproduct,uploadImage } from "@/api/shopping/product";
  import QuillEditor from '@/components/Quill-editor';
  export default {
        name: "group",
    components: {
      QuillEditor,
    },
      data() {
        return {
          userIdList:[],
          pictList:[],
          labelList:[],
          // 遮罩层
          loading: true,
          // 选中数组
          ids: [],
          // 非单个禁用
          single: true,
          // 非多个禁用
          multiple: true,
          // 显示搜索条件
          showSearch: true,
          // 总条数
          total: 0,
          // 商品信息表格数据
          infoList: [],
          // 弹出层标题
          title: "",
          titlePic: "",
          titleGg: "",
          // 是否显示弹出层
          open: false,
          openPic: false,
          openGg: false,
          // 查询参数
          queryParams: {
            pageNum: 1,
            pageSize: 10,
            productCore: null,
            productName: null,
            barCode: null,
            brandId: null,
            oneCategoryId: null,
            twoCategoryId: null,
            threeCategoryId: null,
            supplierId: null,
            categoryId: null,
            price: null,
            averageCost: null,
            publishStatus: null,
            auditStatus: null,
            weight: null,
            length: null,
            height: null,
            width: null,
            colorType: null,
            productionDate: null,
            shelfLife: null,
            descript: null,
            indate: null,
            modifiedTime: null,
            cornerQuantity: null,
            labelName: null,
            salesQuantity: null,
          },
          // 表单参数
          uuu:'display:none',
          nnn:'display:none',
          form: {},
          // 表单参数
          formPic: {
            numproductIdPic:0,
          },
          formGg: {
            numproductId:0,
            numproductPicId:0,
          },
          // 表单校验
          rules: {
            productCore: [
              { required: true, message: "商品编码不能为空", trigger: "blur" }
            ],
            productName: [
              { required: true, message: "商品名称不能为空", trigger: "blur" }
            ],
            brandId: [
              { required: true, message: "品牌表的ID不能为空", trigger: "blur" }
            ],
            supplierId: [
              { required: true, message: "商品的供应商ID不能为空", trigger: "blur" }
            ],
            categoryId: [
              { required: true, message: "商品的分类ID不能为空", trigger: "blur" }
            ],
            price: [
              { required: true, message: "商品销售价格不能为空", trigger: "blur" }
            ],
            averageCost: [
              { required: true, message: "商品加权平均成本不能为空", trigger: "blur" }
            ],
            publishStatus: [
              { required: true, message: "上下架状态：1下架0上架不能为空", trigger: "blur" }
            ],
            auditStatus: [
              { required: true, message: "审核状态：1未审核，0已审核不能为空", trigger: "blur" }
            ],
            productionDate: [
              { required: true, message: "生产日期不能为空", trigger: "blur" }
            ],
            shelfLife: [
              { required: true, message: "商品有效期不能为空", trigger: "blur" }
            ],
            descript: [
              { required: true, message: "商品描述不能为空", trigger: "blur" }
            ],
            indate: [
              { required: true, message: "商品录入时间不能为空", trigger: "blur" }
            ],
            modifiedTime: [
              { required: true, message: "最后修改时间不能为空", trigger: "blur" }
            ],
            delFlag: [
              { required: true, message: "删除标识：0显示 2屏蔽不能为空", trigger: "blur" }
            ]
          }
        };
      },
      created() {
        this.getList();
      },
      methods: {

        getChildrenStatus: function(data){ // 实时更新子组件的变化
          this.form.descript = data
        },

        changesupplierId(){

        },
        /** 添加规格 */
        handleSpecification(row){
          this.resetGg();
          this.openGg = true;
          this.titleGg = "添加规格";
          this.formGg.numproductId =row.productId;
          console.log("***********************************"+this.formGg.numproductId)
          this.formGg.numproductPicId = row.productPicId;
          console.log("***********************************"+this.formGg.numproductPicId)
          // numproductPicId
        },

        handleUpdateGg(row){
          this.resetGg();
          const labelId = row.labelId || this.ids
          getInfolab(labelId).then(response => {
            this.formGg = response.data;
          this.openGg = true;
          this.titleGg = "修改商品标签";
        });

        },

        submitFormGg(){
          this.$refs["formGg"].validate(valid => {
            if(valid) {
              if (this.formGg.labelId != null) {
                updateLabel(this.formGg).then(response => {
                  if (response.code === 200) {
                  this.msgSuccess("修改成功");
                  this.openGg = false;
                  this.getList();
                }
              });
              } else {
                addLabel(this.formGg).then(response => {
                  if (response.code === 200) {
                  this.msgSuccess("新增成功");
                  this.openGg = false;
                  this.getList();
                }
              });
              }
            }
          })
        },
        cancelGg() {
          this.openGg = false;
          this.resetGg();
        },
// 表单重置
        resetGg() {
          this.formGg ={
            labelId: null,
            productId: null,
            labelQuantity: null,
            labelName: null,
            productPicId: null,
            labelUnit: null,
            modifiedTime: null,
            labelPrice: null,
            groupPrice: null,
            labelStatus: "0",
            labelColorType: null,
            labelFreight: null
          }
        },

        dbClickPic(row){
          // var productId = row.productId;
          var productPicId = row.productPicId;
          listlabelfindall(productPicId).then(response => {
            this.labelList = response;
        });
          // this.uuu ='display:block';
          this.nnn ='display:block';
        },






        handleAddPic(row) {
          this.resetPic();
          this.openPic = true;
          this.titlePic = "添加商品图片信息";
          this.formPic.numproductIdPic =row.productId;
        },

        /** 修改按钮操作 */
        handleUpdatePic(row) {
          this.resetPic();
          const productPicId = row.productPicId || this.ids
          getInfoPic(productPicId).then(response => {
            this.formPic = response.data;
          this.openPic = true;
          this.titlePic = "修改商品图片信息";
        });
        },

        /** 删除按钮操作 */
        handleDelete(row) {
          const productPicIds = row.productPicId || this.ids;
          this.$confirm('是否确认删除商品图片信息编号为"' + productPicIds + '"的数据项?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return delInfoPic(productPicIds);
          }).then(() => {
            this.getList();
          this.msgSuccess("删除成功");
        }).catch(function() {});
        },

        resetPic() {
          this.formPic = {
            productPicId: null,
            productId: null,
            picDesc: null,
            picUrl: null,
            isMaster: null,
            picOrder: null,
            picStatus: 0,
            modifiedTime: null
          };
        },
        //文件上传
        upload(param){
          let file = param.file;
          let fileType = file.type;
          let isLt2M = file.size / 1024 / 1024 < 500;
          if (!isLt2M) {
            this.$message.error("上传大小大小必须小于500M");
            this.fileList=[];
            return;
          }
          let form = new FormData();
          form.append("file", file);
          uploadImage(form).then((res)=>{
            if(res.code==200){
            this.formPic.picUrl = "http://51jhf.com/profile/xiazai/"+res.filePath;
          }
          console.log(res);
        })
        },
        //移除文件之前
        beforeRemove(file, fileList) {
          return this.$confirm(`确定移除 ${file.name}？`);
        },
        //移除
        handleRemove(file, fileList){
          this.formPic.picUrl = '';
          this.fileList=[];
        },
        //上传异常
        handleError(err, file, fileList){
          this.$message.error("上传失败");
        },
        /** 提交按钮 */
        submitFormPic() {
          this.$refs["formPic"].validate(valid => {
            if (valid) {
              if (this.formPic.productPicId != null) {
                updateInfoPic(this.formPic).then(response => {
                  if (response.code === 200) {
                  this.msgSuccess("修改成功");
                  this.openPic = false;
                  this.getList();
                  this.uuu ='display:none';
                }
              });
              } else {
                addInfoPic(this.formPic).then(response => {
                  if (response.code === 200) {
                  this.msgSuccess("新增成功");
                  this.openPic = false;
                  this.getList();
                  this.uuu ='display:none';
                }
              });
              }
            }
          });

        },

        dbClick(row){
          var productId = row.productId;
          listppict(productId).then(res=>{
            this.pictList = res;
        })
          listlabelfindproduct(productId).then(res=>{
            this.productList = res;
        })
          //   listlabelfindall(productId).then(response => {
          //     this.labelList = response;
          // });
          this.uuu ='display:block';
          // this.nnn ='display:block';
        },

        cancelPic(){
          this.openPic = false;
          this.resetPic();
        },

        /** 查询商品信息列表 */
        getList() {
          this.loading = true;
          listInfo(this.queryParams).then(response => {
            this.infoList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
        },
        // 取消按钮
        cancel() {
          this.open = false;
          this.reset();
        },
        // 表单重置
        reset() {
          this.form = {
            productId: null,
            productCore: null,
            productName: null,
            barCode: null,
            brandId: null,
            oneCategoryId: null,
            twoCategoryId: null,
            threeCategoryId: null,
            supplierId: null,
            categoryId: null,
            price: null,
            averageCost: null,
            publishStatus: 0,
            auditStatus: 0,
            weight: null,
            length: null,
            height: null,
            width: null,
            colorType: null,
            productionDate: null,
            shelfLife: null,
            descript: null,
            indate: null,
            modifiedTime: null,
            cornerQuantity: null,
            labelName: null,
            salesQuantity: null,
            delFlag: null
          };
          this.resetForm("form");
        },
        /** 搜索按钮操作 */
        handleQuery() {
          this.queryParams.pageNum = 1;
          this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
          this.resetForm("queryForm");
          this.handleQuery();
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
          this.ids = selection.map(item => item.productId)
          this.single = selection.length!==1
          this.multiple = !selection.length
        },
        /** 新增按钮操作 */
        handleAdd() {
          this.reset();
          this.open = true;
          this.title = "添加商品信息";
          this.init();
        },
        init(){
          findAllUserId().then(res=>{
            this.userIdList = res;
          })
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
          this.reset();
          const productId = row.productId || this.ids
          getInfo(productId).then(response => {
            this.form = response.data;
          this.open = true;
          this.title = "修改商品信息";
        });
        },
        /** 提交按钮 */
        submitForm() {
          this.$refs["form"].validate(valid => {
            if (valid) {
              if (this.form.productId != null) {
                updateInfo(this.form).then(response => {
                  if (response.code === 200) {
                  this.msgSuccess("修改成功");
                  this.open = false;
                  this.getList();
                }
              });
              } else {
                addInfo(this.form).then(response => {
                  if (response.code === 200) {
                  this.msgSuccess("新增成功");
                  this.open = false;
                  this.getList();
                }
              });
              }
            }
          });
        },
        /** 删除按钮操作 */
        handleDelete(row) {
          const productIds = row.productId || this.ids;
          this.$confirm('是否确认删除商品信息编号为"' + productIds + '"的数据项?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return delInfo(productIds);
          }).then(() => {
            this.getList();
          this.msgSuccess("删除成功");
        }).catch(function() {});
        },
        /** 导出按钮操作 */
        handleExport() {
          const queryParams = this.queryParams;
          this.$confirm('是否确认导出所有商品信息数据项?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return exportInfo(queryParams);
          }).then(response => {
            this.download(response.msg);
        }).catch(function() {});
        }
      }
    }
</script>

<style scoped>

</style>
